<template>

  <NuxtLayout name="default-layout">
    <template #main>
      <div class="min-h-dvh">
        <div class="hero min-h-min mt-36">
          <div class="hero-content flex-col lg:flex-row-reverse min-w-full">
            <div class="card bg-base-100 w-full max-w-sm shrink-0 shadow-2xl">
              <div class="card-body">
                <div class="flex justify-end">
                  <img src="assets/images/login-welcome.jpeg" width="42">
                </div>
                <div class="form-control">
                  <label class="label">
                    <span class="label-text">账号</span>
                  </label>
                  <input type="email" placeholder="请输入账号" v-model="form.account" class="input input-bordered"/>
                </div>
                <div class="form-control">
                  <label class="label">
                    <span class="label-text">手机号</span>
                  </label>
                  <input type="email" placeholder="请输入手机号" v-model="form.cellphoneNumber" class="input input-bordered"/>
                </div>
                <div class="form-control">
                  <label class="label">
                    <span class="label-text">新密码</span>
                  </label>
                  <input type="password" placeholder="请输入新密码" v-model="form.password" class="input input-bordered"/>
                  <label class="label">
                    <span class="label-text-alt link link-hover">请牢记密码，不要告知他人。</span>
                  </label>
                </div>
                <div class="form-control mt-6">
                  <button class="btn btn-primary" @click="doSubmit()">确认</button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </template>
  </NuxtLayout>

</template>

<script setup>
import {httpPost} from "../utils/http/http-helper.js";
import {notificationError, notificationSuccess} from "../utils/notification/index.js";

const router = useRouter()

const form = ref({
  account: '',
  cellphoneNumber: '',
  password: '',
})


/**
 * 忘记密码表单提交
 */
function doSubmit() {
  console.log(form.value)
  httpPost('/api/noauth/forgot-passowrd', form.value).then(resp => {
    console.log(resp)
    if (!resp.success) {
      notificationError(resp.msg)
      return
    }
    notificationSuccess('找回密码成功，即将跳转到登录页。')
    // 单位是毫秒 这里是指1秒后执行 跳转到登录页面
    setTimeout(() => {
      router.push('/login')
    }, 1000)
  })

}
</script>

<style scoped>

</style>